const http = require("../../utils/http")

// pages/item/item.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    itemObj: {}, //全部
    itemUrl: [], //轮播图
    swiperIndex: 0, //轮播图下标
    vertical: false, //false 横向   true 纵向
    autoplay: true, //自动播放
    interval: 2000, //动画时间
    duration: 1000, //间隔时间
    circular: true, //衔接动画  
    tripType: true, //行程
    detailsType: false, //详情
    priceType: false, //价格
    tripTop: 0, //行程离顶部的距离
    detailsTop: 0, //详情离顶部距离
    priceTop: 0, //价格离顶部距离
    type: false
  },
  //滚动到行程位置
  tripClick(){
    const tripTop = this.data.tripTop
    wx.pageScrollTo({
      scrollTop: tripTop,
      duration: 300
    })
  },
   //滚动到详情位置
   detailsClick(){
    const detailsTop = this.data.detailsTop
    wx.pageScrollTo({
      scrollTop: detailsTop,
      duration: 300
    })
  },
   //滚动到行程位置
   priceClick(){
    const priceTop = this.data.priceTop
    wx.pageScrollTo({
      scrollTop: priceTop,
      duration: 300
    })
  },
  //返回首页
  goHome() {
    wx.navigateBack();
  },
  //拨打电话
  phonecall() {
    wx.makePhoneCall({
      phoneNumber: '13888888888' //仅为示例，并非真实的电话号码
    })
  },
  //获取当前轮播图下标
  changeSwiper(ev) {
    this.setData({
      swiperIndex: ev.detail.current
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    //获取内容页数据
    http.request("product/product/getProductDetails/" + options.id, "", "get").then(res => {
      this.setData({
        itemObj: res.data,
        itemUrl: res.data.product_base_info.product_bright
      });
      //获取某个 view离顶部的距离
      wx.createSelectorQuery().select('#trip').boundingClientRect(rect => {
        this.setData({
          tripTop: rect.top
        })
      }).exec();
      wx.createSelectorQuery().select('#details').boundingClientRect(rect => {
        this.setData({
          detailsTop: rect.top
        })
      }).exec();
      wx.createSelectorQuery().select('#price').boundingClientRect(rect => {
        this.setData({
          priceTop: rect.top
        })
      }).exec();
    })
  },
  //页面滚动时触发的钩子
  onPageScroll(ev) {
    const top = ev.scrollTop + 23;
    if (top >= this.data.tripTop) {
      this.setData({
        type: true
      })
    } else {
      this.setData({
        type: false
      })
    }
    const {
      tripTop,
      detailsTop,
      priceTop,
    } = this.data;
    //滚动时需要切换， 激活状态的滚动事件
    if (top >= tripTop && top <= detailsTop) {
      this.setData({
        tripType: true,
        detailsType: false,
        priceType: false
      })
    }else if(top >= detailsTop && top <=priceTop ){
      this.setData({
        tripType: false,
        detailsType: true,
        priceType: false
      })
    }else if(top >= priceTop){
      this.setData({
        tripType: false,
        detailsType: false,
        priceType: true
      })
    }
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    this.setData({
      autoplay: true
    })
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    this.setData({
      autoplay: false
    })
  },
})